<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>添加用户</h1>
    <form action="/add" method="POST">
        <label for="">姓名：</label>
        <input type="text" class="change" name="name" placeholder="姓名">
        <br>
        <label for="">年龄：</label>
        <input type="text" class="change" name="age" placeholder="年龄">
        <br>
        <label for="">其他：</label>
        <input type="text" class="change" name="othters" placeholder="体重">
        <br>
        <input class="btn" type="submit" value="添加">
    </form>
    <script>
        let btn = document.querySelector('.btn')
        let texts = document.querySelectorAll('.change')
        btn.disabled = true
        texts.forEach(item=>{
            console.log(item.value)
            item.addEventListener('blur',()=>{
                if(texts[0].value === ''||texts[1].value === ''||texts[2].value === ''){
                    btn.disabled = true
                }else{
                    btn.disabled = false
                }
            })
        })
    </script>
</body>
</html>